/**
* scss 怎么动态创建变量
* 本来想用 @function，@for 好像不可以动态创建
* 2020.12.19 lyt 记录
**/

/* 定义初始颜色
------------------------------- */
@--color-primary: #409eff;
@--color-whites: #ffffff;
@--color-primary-light-1: mix(@--color-whites, @--color-primary, 10%);
@--color-primary-light-2: mix(@--color-whites, @--color-primary, 20%);
@--color-primary-light-3: mix(@--color-whites, @--color-primary, 30%);
@--color-primary-light-4: mix(@--color-whites, @--color-primary, 40%);
@--color-primary-light-5: mix(@--color-whites, @--color-primary, 50%);
@--color-primary-light-6: mix(@--color-whites, @--color-primary, 60%);
@--color-primary-light-7: mix(@--color-whites, @--color-primary, 70%);
@--color-primary-light-8: mix(@--color-whites, @--color-primary, 80%);
@--color-primary-light-9: mix(@--color-whites, @--color-primary, 90%);
@--color-success: #67c23a;
@--color-success-light-1: mix(@--color-whites, @--color-success, 10%);
@--color-success-light-2: mix(@--color-whites, @--color-success, 20%);
@--color-success-light-3: mix(@--color-whites, @--color-success, 30%);
@--color-success-light-4: mix(@--color-whites, @--color-success, 40%);
@--color-success-light-5: mix(@--color-whites, @--color-success, 50%);
@--color-success-light-6: mix(@--color-whites, @--color-success, 60%);
@--color-success-light-7: mix(@--color-whites, @--color-success, 70%);
@--color-success-light-8: mix(@--color-whites, @--color-success, 80%);
@--color-success-light-9: mix(@--color-whites, @--color-success, 90%);
@--color-info: #909399;
@--color-info-light-1: mix(@--color-whites, @--color-info, 10%);
@--color-info-light-2: mix(@--color-whites, @--color-info, 20%);
@--color-info-light-3: mix(@--color-whites, @--color-info, 30%);
@--color-info-light-4: mix(@--color-whites, @--color-info, 40%);
@--color-info-light-5: mix(@--color-whites, @--color-info, 50%);
@--color-info-light-6: mix(@--color-whites, @--color-info, 60%);
@--color-info-light-7: mix(@--color-whites, @--color-info, 70%);
@--color-info-light-8: mix(@--color-whites, @--color-info, 80%);
@--color-info-light-9: mix(@--color-whites, @--color-info, 90%);
@--color-warning: #e6a23c;
@--color-warning-light-1: mix(@--color-whites, @--color-warning, 10%);
@--color-warning-light-2: mix(@--color-whites, @--color-warning, 20%);
@--color-warning-light-3: mix(@--color-whites, @--color-warning, 30%);
@--color-warning-light-4: mix(@--color-whites, @--color-warning, 40%);
@--color-warning-light-5: mix(@--color-whites, @--color-warning, 50%);
@--color-warning-light-6: mix(@--color-whites, @--color-warning, 60%);
@--color-warning-light-7: mix(@--color-whites, @--color-warning, 70%);
@--color-warning-light-8: mix(@--color-whites, @--color-warning, 80%);
@--color-warning-light-9: mix(@--color-whites, @--color-warning, 90%);
@--color-danger: #f56c6c;
@--color-danger-light-1: mix(@--color-whites, @--color-danger, 10%);
@--color-danger-light-2: mix(@--color-whites, @--color-danger, 20%);
@--color-danger-light-3: mix(@--color-whites, @--color-danger, 30%);
@--color-danger-light-4: mix(@--color-whites, @--color-danger, 40%);
@--color-danger-light-5: mix(@--color-whites, @--color-danger, 50%);
@--color-danger-light-6: mix(@--color-whites, @--color-danger, 60%);
@--color-danger-light-7: mix(@--color-whites, @--color-danger, 70%);
@--color-danger-light-8: mix(@--color-whites, @--color-danger, 80%);
@--color-danger-light-9: mix(@--color-whites, @--color-danger, 90%);
@--bg-topBar: #ffffff;
@--bg-menuBar: #545c64;
@--bg-columnsMenuBar: #545c64;
@--bg-topBarColor: #606266;
@--bg-menuBarColor: #eaeaea;
@--bg-columnsMenuBarColor: #e6e6e6;

/* 赋值给:root
------------------------------- */
:root {
	--color-primary: @--color-primary;
	--color-whites: @--color-whites;
	--color-primary-light-1: @--color-primary-light-1;
	--color-primary-light-2: @--color-primary-light-2;
	--color-primary-light-3: @--color-primary-light-3;
	--color-primary-light-4: @--color-primary-light-4;
	--color-primary-light-5: @--color-primary-light-5;
	--color-primary-light-6: @--color-primary-light-6;
	--color-primary-light-7: @--color-primary-light-7;
	--color-primary-light-8: @--color-primary-light-8;
	--color-primary-light-9: @--color-primary-light-9;
	--color-success: @--color-success;
	--color-success-light-1: @--color-success-light-1;
	--color-success-light-2: @--color-success-light-2;
	--color-success-light-3: @--color-success-light-3;
	--color-success-light-4: @--color-success-light-4;
	--color-success-light-5: @--color-success-light-5;
	--color-success-light-6: @--color-success-light-6;
	--color-success-light-7: @--color-success-light-7;
	--color-success-light-8: @--color-success-light-8;
	--color-success-light-9: @--color-success-light-9;
	--color-info: @--color-info;
	--color-info-light-1: @--color-info-light-1;
	--color-info-light-2: @--color-info-light-2;
	--color-info-light-3: @--color-info-light-3;
	--color-info-light-4: @--color-info-light-4;
	--color-info-light-5: @--color-info-light-5;
	--color-info-light-6: @--color-info-light-6;
	--color-info-light-7: @--color-info-light-7;
	--color-info-light-8: @--color-info-light-8;
	--color-info-light-9: @--color-info-light-9;
	--color-warning: @--color-warning;
	--color-warning-light-1: @--color-warning-light-1;
	--color-warning-light-2: @--color-warning-light-2;
	--color-warning-light-3: @--color-warning-light-3;
	--color-warning-light-4: @--color-warning-light-4;
	--color-warning-light-5: @--color-warning-light-5;
	--color-warning-light-6: @--color-warning-light-6;
	--color-warning-light-7: @--color-warning-light-7;
	--color-warning-light-8: @--color-warning-light-8;
	--color-warning-light-9: @--color-warning-light-9;
	--color-danger: @--color-danger;
	--color-danger-light-1: @--color-danger-light-1;
	--color-danger-light-2: @--color-danger-light-2;
	--color-danger-light-3: @--color-danger-light-3;
	--color-danger-light-4: @--color-danger-light-4;
	--color-danger-light-5: @--color-danger-light-5;
	--color-danger-light-6: @--color-danger-light-6;
	--color-danger-light-7: @--color-danger-light-7;
	--color-danger-light-8: @--color-danger-light-8;
	--color-danger-light-9: @--color-danger-light-9;
	--bg-topBar: @--bg-topBar;
	--bg-menuBar: @--bg-menuBar;
	--bg-columnsMenuBar: @--bg-columnsMenuBar;
	--bg-topBarColor: @--bg-topBarColor;
	--bg-menuBarColor: @--bg-menuBarColor;
	--bg-columnsMenuBarColor: @--bg-columnsMenuBarColor;
}
